<template>
  <div class="all">
    <div class="W-body">
<el-table :data="Data" border :header-cell-style="{background:'#eef3f7'}">
    <el-table-column prop="userName" label="用户名" align="center"></el-table-column>
    <el-table-column prop="nickName" label="用户昵称" align="center">
    </el-table-column>
    <el-table-column prop="drawType" label="魔方游玩类型" align="center"> </el-table-column>
    <el-table-column align="center" prop="addTime" label="游玩时间"></el-table-column>
    <el-table-column align="center" prop="giftName" label="游戏名称"></el-table-column>
    <el-table-column align="center" label="礼物图标">
      <template slot-scope="scope">
          <el-image :src="scope.row.giftIcon"></el-image>
      </template>
    </el-table-column>
    <el-table-column align="center" prop="giftNum" label="中奖礼物个数"></el-table-column>
  </el-table>
  <div class="Page">
        <el-pagination
        background hide-on-single-page
          @current-change="handleCurrentChange"
          :current-page="date.pageIndex"
          :page-size="date. pageSize"
          layout="total, prev, pager, next, jumper"
          :total="date.quantity">
        </el-pagination>

  </div>
    </div>
  </div>
</template>

<script>
  import {recordList} from '@/utils/API'
  import Cookies from 'js-cookie'
  export default {
      data() {
        return {
          date:{uid:'',
          time1:'',
          time2:'',
          pageIndex:1,
          pageSize:20,
          quantity:0,
          },
          time1:'',
          Data: [],
          admin:{
            adminName:Cookies.get('adminName'),
            token:Cookies.get('token')
          },
        }
      },
      methods:{
        search(){
          this.date.time1=this.time1[0]
         this.date.time2=this.time1[1]
          this.Postdata()
        },
        handleSizeChange(val) {
          this.date.pageSize=val
          this.Postdata()
                  },
         handleCurrentChange(val) {
           this.date.pageIndex=val
          this.Postdata()

        },
        Postdata(){
          recordList(this.admin,this.date).then(res=>{
            this.Data=res.data.records
            this.date.quantity=res.data.total
          })

        }
      },
      mounted() {
        this.Postdata()
      }
    }
</script>

<style scoped>
  .el-input{
    width: 120px;
  }
  .Page{
    margin: auto;
    width: 50%;
  }
.W-body{
  margin-top: 15px;
}
.el-image{
  width: 100px;

}
</style>
